<template>
  <div id="member-binding-shop-list-page" :style="{
    width:'100%',
    height: (this.getWinSize().height-35-this.getSafeArea().top)+'px',
  }">
    <div class="page-title" :style="{
      top:(this.getSafeArea().top)+'px'
    }">
      <div id="back-button" @click="$router.back()">
        <i href="javascript:void(0)" class="el-icon-arrow-left"></i>
      </div>
      <span>绑定店铺列表</span>
    </div>

    <i-scroller-box style=" position: relative" class="shop" ref="i-scroller-box"
                    url="Member/bindingShopList"
                    :height="this.getWinSize().height-this.getSafeArea().top-50"
                    :style="{
                      width:'100%',
                      top:(this.getSafeArea().top)+'px'
                    }">
      <template v-slot:list-item="{key,data}">
        <shop-list-item :show-type="1" :key="key" :cancel-call-back="getList" :shop="{
        id:data.id,
        name:data.name,
        logo:data.logo,
        classifyName:data.classifyName?data.classifyName.split(','):[],
        address:data.province+','+data.city+','+data.county+' '+data.address
      }"/>
      </template>
    </i-scroller-box>
  </div>
</template>

<script>
import ShopListItem from '../common/ShopListItem'
import IScrollerBox from '../common/IScrollerBox'
export default {
  name: 'MemberBindingShopList',
  components: {IScrollerBox, ShopListItem},
  mounted () {
    let $this=this
    setTimeout(function () {
      $this.getList()
    },500)
  },
  methods:{
    getList: function () {
      this.$refs['i-scroller-box'].getList({
        page: 1,
        form: {}
      })
    }
  }
}
</script>

<style scoped>

</style>
